<template>
    <div>
        <input type="file" @change="handleFileUpload" accept="image/*">
        <img v-if="imagePreview" :src="imagePreview" alt="Preview">
    </div>
</template>

<script setup>
import { ref } from 'vue';
import { saveAs } from 'file-saver';

const imagePreview = ref(null);6

const handleFileUpload = (event) => {
    const file = event.target.files[0];
    if (!file) return;

    // 验证文件类型
    if (!file.type.startsWith('image/')) {
        alert('请上传图片文件');
        return;
    }

    // 创建预览图
    const reader = new FileReader();
    reader.onload = (e) => {
        imagePreview.value = e.target.result;

        // 使用FileSaver.js保存图片
        saveAs(file, file.name);
    };
    reader.readAsDataURL(file);
};
</script>
